<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="../../JS/rookievw.js" defer type="text/javascript"></script>
    <!-- <script src="../../TS/index.ts"></script> -->
    <style>
      * {
        margin: 0;
        padding: 0;
      }
      nav {
        width: 100px;
        height: 100px;
        margin: 100px 100px;
        border: 5px solid #ccc;
        background-color: red;
      }
    </style>
  </head>
  <body>
    <nav></nav>
  </body>
  <script>
    let oNav = document.querySelector("nav");
    // oNav.addEventListener("mousemove", function () {
    //   oNav.style.backgroundColor = color_rgb();
    // });
    // console.log(oNav.getBoundingClientRect());
    document.addEventListener("keydown", function (e) {
      console.log(e.keyCode);
    });
  </script>
</html>
